<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .box{
            width: 300px;
            border: 1px solid red;
            /* 默认效果
                div里面有文字,并且换行了,显示的效果也会换行 */
                /* white-space: pre; 等价于pre标签*/
                /* nowrap 不换行,依然保留原来空格,保留一个空格 */
                /* white-space: nowrap; (重点)*/
                /* pre-wrap:去掉开头空格,保留换行 */
                /* white-space: pre-wrap; */
                /* white-space: pre-line; */
        }
    </style>
</head>
<body>
    <div class="box">
        aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
        cccccccccccccccccccccccccccccccccccccc
    </div>
    <!-- <pre>
        我   很      帅!
         aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
         创
    </pre> -->
</body>
</html>